<template>
    <div class="echarts06" ref="echarts06"></div>
</template>

<script>
import * as echarts from 'echarts';

export default {
    data() {
        return {
            chart: null,
            max: 1000,
            value: 346,
            option: {
                title: [{
                    text: '{a|政府采购}\n{b|' + Math.round((346 * 1000) / 1000) + '}',
                    show: true,
                    x: 'center',
                    y: 'center',
                    textStyle: {
                        rich: {
                            a: {
                                fontSize: 40,
                                color: '#808080',
                                padding: [0, 0, 25, 0]
                            },
                            b: {
                                fontSize: 40,
                                color: '#333333'
                            }
                        }
                    }
                }],
                tooltip: {
                    show: true,
                    formatter: '{c}个'
                },
                polar: {
                    center: ['50%', '50%'],
                    radius: ['60%', '75%']
                },
                angleAxis: {
                    max: 1000,
                    startAngle: 120,
                    show: false
                },
                radiusAxis: {
                    type: 'category',
                    show: true,
                    axisLabel: { show: false },
                    axisLine: { show: false },
                    axisTick: { show: false }
                },
                series: [{
                    name: '',
                    type: 'bar',
                    roundCap: true,
                    showBackground: true,
                    backgroundStyle: {
                        color: '#F3F2F7'
                    },
                    data: [346],
                    coordinateSystem: 'polar',
                    itemStyle: {
                        color: "#466CF7"
                    }
                }]
            }
        };
    },
    mounted() {
        this.initChart();
    },
    methods: {
        initChart() {
            this.chart = echarts.init(this.$refs.echarts06);
            this.chart.setOption(this.option);
        }
    },
    beforeDestroy() {
        if (this.chart) {
            this.chart.dispose();
        }
    }
}
</script>

<style scoped>
.echarts06 {
    width: 100%;
    height: 100%;
}
</style>